import request from '../../utils/request.js'

Page({

  /**
   * 页面的初始数据
   */
  data: {
    bannerList: [],//轮播图数据
    recommendList: [],//推荐歌单
    topList: [],//排行榜数据
    index: 0,//标识点击音乐的下标
    bannerListSongs: [{}],//轮播图区域歌曲
    topListIdArr: [],//排行榜id
    playListInfo: '',//top歌单的信息
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: async function (options) {

    //获取轮播图数据
    let bannerListData = await request('/banner', { type: 2 })
    this.setData({
      bannerList: bannerListData.banners
    })

    //获取推荐歌单数据
    let recommendListData = await request('/personalized', { limit: 10 })
    this.setData({
      recommendList: recommendListData.result
    })

    //获取排行榜数据
    /* 
      需求分析：
        1.根据idex的值获取对应的数据
        2.idx的取值范围是0-20，我们需要0-4
        3.需要发送5次请求
      前++和后++的区别
        1.先看到的是运算符还是值
        2.如果先看到的是运算符就先运算再辅助
        3.如果先看到的是值就先赋值再运算
    */
    let index = 0
    let resultArr = []
    let resultArr1 = []
    while (index < 4) {
      let topListData = await request('/topList/detail');
      let topListId = topListData.list[index].id
      console.log(topListData);
      //splice(会修改原数组) slice(不会修改原数组)
      let topListItem = { pic: topListData.list[index].coverImgUrl, name: topListData.list[index].name, tracks: topListData.list[index].tracks.slice(0, 3) }
      resultArr.push(topListItem)
      resultArr1.push(topListId)
      //在这里更新数据，不需要等待5次请求全部结束才更新，用户体验更好，但是渲染的次数会多一些
      this.setData({
        topList: resultArr,
        topListIdArr: resultArr1
      })
      index++;
    }


    //更新topList的状态值,放在此处更新会导致发送请求的过程中页面长时间白屏，用户体验差
    // this.setData({
    //   topList: resultArr
    // })
  },

  //top内容跳转至歌单列表页2
  async toPlayList2(event) {
    console.log(event);
    let { topListIdArr } = this.data
    //路由跳转传参:query参数
    wx.navigateTo({
      url: '/pages/playList/playList?playListId=' + topListIdArr[event.currentTarget.dataset.index],
    })
  },

  //获取top歌单歌曲
  async getplayListInfo(playListId) {

    let playListInfo = await request(`/playlist/track/all?id=${playListId}&limit=3`)
    let playListSongs = playListInfo.songs
    // console.log(playListSongs);
    this.setData({
      playListInfo,
      playListSongs
    })
  },

  //获取音乐详情的功能函数
  async getMusicInfo(musicId) {
    let songData = await request('/song/detail', { ids: musicId });
    //songData.song[0].dt 单位ms
    // 使用momentjs格式化音乐时长数据
    let durationTime = moment(songData.songs[0].dt).format('mm:ss')
    this.setData({
      song: songData.songs[0],
      durationTime,
    })
    //动态修改窗口的标题
    wx.setNavigationBarTitle({
      title: this.data.song.name
    })
  },

  // 跳转至toRecommendSong页面的回调
  toRecommendSong() {
    wx.navigateTo({
      url: '/songPackage/pages/recommendSong/recommendSong',
    })
  },

  //跳转至other页面
  toOther() {
    wx.navigateTo({
      url: '/pages/other/other',
    })
  },

  //跳转至歌曲详情页面
  tosongDetail(event) {
    if (event.currentTarget.dataset.song) {
      let { song } = event.currentTarget.dataset
      let { bannerListSongs } = this.data
      bannerListSongs.splice(0, 1, song)
      wx.navigateTo({
        url: '/songPackage/pages/songDetail/songDetail?index=' + 0,
        success(res) {
          // 通过eventChannel向被打开页面传送数据
          res.eventChannel.emit('acceptDataFromOpenerPage', bannerListSongs)
        }
      })
    }
  },

  //跳转至歌单列表页
  toPlayList(event) {
    console.log(event);
    let { song, index } = event.currentTarget.dataset
    this.setData({
      index
    })
    //路由跳转传参:query参数
    wx.navigateTo({
      url: '/pages/playList/playList?playListId=' + song.id,
    })
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})